<template>
  <div>
    <van-form @submit="methods.onSubmit">
      <van-cell-group inset>
        <van-field
          v-model="name"
          name="名称"
          label="名称"
          placeholder="分类名称"
        />
        <van-field
          v-model="explain"
          name="描述"
          label="描述"
          placeholder="分类描述"
        />
        <div class="van-hairline--bottom"></div>
        <!-- <div class="my_divider"></div> -->
      </van-cell-group>
      <div style="margin: 16px">
        <van-button round block type="primary" native-type="submit">
          添加
        </van-button>
      </div>
    </van-form>
  </div>
</template>

<script setup>
import { addGoodsType } from "@/api/manage";
import { load } from "@/utils/load";
import { showConfirmDialog, showToast } from "vant";
import { ref } from "vue";
const name = ref("");
const explain = ref("");
const methods = {
  onSubmit: async (values) => {
    if (!name.value) {
      showToast("名称不能为空");
      return;
    }
    if (!explain.value) {
      showToast("描述不能为空");
      return;
    }

    showConfirmDialog({
      title: "提示",
      message: "确认新增吗?",
    })
      .then(async () => {
        // on confirm
        load();
        const res = await addGoodsType({
          name: name.value,
          explain: explain.value,
        });

        if (res.result === 0) {
          showToast("添加成功");
        } else {
          showToast(res.message);
        }
      })
      .catch(() => {
        // on cancel
        // console.log(222222)
      });
    // return;
  },
};
</script>

<style  scoped>
</style>